<template>
  <!-- 对话框(添加 / 修改) -->
  <el-dialog :title="title" :visible.sync="show" width="500px" append-to-body :before-close="cancel">
    <el-form ref="form" :model="form" :rules="rules" label-width="80px">

      <el-form-item label="教师" prop="teacherId">
        <el-select
          v-model="form.teacherId"
          placeholder="请选择老师"
          size="small"
          @change="getLabelName"
          ref="teacherId"
        >
          <el-option
            v-for="teacher in this.teachers"
            :key="teacher.id"
            :label="teacher.teacherName"
            :value="teacher.id"
          />
        </el-select>
      </el-form-item>

      <el-form-item label="评价项目" prop="evaluationItemId">
        <el-select
          v-model="form.evaluationItemId"
          placeholder="请选择"
          size="small"
          @change="getLabelName"
          ref="evaluationItemId"
        >
          <el-option
            v-for="evaluationItem in this.evaluationItems"
            :key="evaluationItem.id"
            :label="evaluationItem.evaluationItem"
            :value="evaluationItem.id"
          />
        </el-select>
      </el-form-item>

      <el-form-item label="评价描述" prop="evaluationText">
        <el-input v-model="form.evaluationText" placeholder="请输入评价描述" />
      </el-form-item>


      <el-form-item label="评分等级" prop="scoreItemId">
        <el-radio-group v-model="form.scoreItemId"
                        @change="getLabelName"
                        ref="scoreItemId">
          <el-radio v-for="evaluationScoreItem in this.evaluationScoreItems"
                    :key="evaluationScoreItem.id" :label="evaluationScoreItem.id">
            {{evaluationScoreItem.scoreLevel}}</el-radio>
        </el-radio-group>
      </el-form-item>

    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="submitForm">确 定</el-button>
      <el-button @click="cancel">取 消</el-button>
    </div>
  </el-dialog>
</template>

<script>
  import { createTeacherEvaluation, updateTeacherEvaluation } from "@/api/study/teacherEvaluation";
  import { getEvaluationItemsList } from "@/api/study/evaluationItem";
  import { searchEvaluationScoreItemList } from "@/api/study/evaluationScoreItem";

  export default {
    name: "studentEvaluationEdit",
    components: {
    },
    data() {
      return {
        // 表单参数
        form: {},
        // 表单校验
        rules: {
          studentId: [{ required: true, message: "学生id不能为空", trigger: "blur" }],
          teacherId: [{ required: true, message: "老师id不能为空", trigger: "blur" }],
          collegeId: [{ required: true, message: "所属学院id不能为空", trigger: "blur" }],
          departmentId: [{ required: true, message: "所属系部id不能为空", trigger: "blur" }],
          professionsId: [{ required: true, message: "所属专业id不能为空", trigger: "blur" }],
          classeId: [{ required: true, message: "所属班级id不能为空", trigger: "blur" }],
          evaluationItemId: [{ required: true, message: "评价项目id不能为空", trigger: "blur" }],
          scoreItemId: [{ required: true, message: "评分等级id不能为空", trigger: "blur" }],
        },
        teachers: [],
        evaluationItems: [],
        evaluationScoreItems: [],
      };
    },
    created() {},
    props: {
      // 是否显示弹出层
      show: {
        type: Boolean,
        default: false
      },
      // 显示弹出层标题
      title: {
        type: String,
        default: ''
      }
    },
    methods: {
      /** 初始化编辑的数据**/
      initData(rowData) {
        this.getEvaluationTeachers();
        this.getEvaluationItems();
        this.getEvaluationScoreItemList();
        this.reset();
        if (rowData && rowData.id) {
          this.form = rowData;
          this.form.datetimerange = [this.form.startTime,this.form.endTime]
        }
      },
      /** 取消按钮 */
      cancel() {
        this.$emit('update:show', false)
        this.reset();
      },
      /** 表单重置 */
      reset() {
        this.form = {
                            id: undefined,
                            studentId: undefined,
                            studentName: undefined,
                            teacherId: undefined,
                            teacherName: undefined,
                            evaluationText: undefined,
                            collegeName: undefined,
                            collegeId: undefined,
                            departmentName: undefined,
                            departmentId: undefined,
                            professionsName: undefined,
                            professionsId: undefined,
                            classeName: undefined,
                            classeId: undefined,
                            evaluationItemId: undefined,
                            evaluationItemName: undefined,
                            scoreItemId: undefined,
                            scoreItemName: undefined,
                            remark: undefined,
                            orgId: undefined,
        };
        this.resetForm("form");
      },
      /** 提交按钮 */
      submitForm() {
        this.$refs["form"].validate(valid => {
          if (!valid) {
            return;
          }
          this.form.studentName = this.$store.getters.nickname;
          this.form.studentId = this.$store.getters.userId;

          // 添加的提交
          createTeacherEvaluation(this.form).then(response => {
            this.$modal.msgSuccess("新增成功");
            this.$emit('success');
            this.cancel();
          });
        });
      },

      //获取学生所在班级的所有老师
      getEvaluationTeachers(){
        //不知老师与班级如何关联，暂时先用测试数据
        this.teachers = [{id:'1',teacherName:'张三'}];

      },

      //获得评价项目列表
      getEvaluationItems(){
        this.evaluationItems = [];
        getEvaluationItemsList().then(response => {
          this.evaluationItems = response.data;
        });
      },


      getEvaluationScoreItemList(){
        this.evaluationScoreItems = [];
        searchEvaluationScoreItemList({}).then(response => {
          this.evaluationScoreItems = response.data;
        });
      },


      getLabelName(event){
        let evaluationItemName = "";
        let scoreItemName = "";
        let teacherName = "";
        let formData = this.form;
        this.$nextTick(()=>{
          teacherName = this.$refs.teacherId.selectedLabel;
          evaluationItemName = this.$refs.evaluationItemId.selectedLabel;
          scoreItemName = this.$refs.scoreItemId.selectedLabel;
          formData.teacherName = teacherName;
          formData.evaluationItemName = evaluationItemName;
          formData.scoreItemName = scoreItemName;

        // console.log(this.$refs.scoreItemId);
        });


      },


    }
  };
</script>
